/*经费分配明细页面 */
<template>
    <div class="div_background">
        <el-form :model="Info" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
            <el-card class="box-card">
                <div  class="text item">
                    <el-row>
                        <el-col :span="24">
                            <span style="color: blue; margin-left: 20px">基本信息</span>
                            &nbsp;&nbsp;
                            <span style="color: rgb(168, 153, 153); margin-left: 20px">带<span style="color:red">*</span>符号为必添加</span>
                        </el-col>
                    </el-row>
                    <br/>
                    <hr/>
                    <br/>
                    <el-row>
                        <el-col :span="24">
                            <el-row>
                                <el-col :span="24">
                                <el-row>
                                    <el-col :span="5">项目编号：</el-col>
                                    <el-col :span="10">
                                        <el-form-item label=" " prop="projectId">
                                            <el-select style="width:1000px" v-model="Info.projectId">
                                                <el-option
                                                v-for="(item,index) in Projectoptions"
                                                :key="index"
                                                :label="item.projectId"
                                                :value="item.projectId">
                                                </el-option>
                                            </el-select>
                                        </el-form-item>
                                    </el-col>
                                    <el-col :span="4">
                                        <i class="el-icon-search" @click="detailProject()"></i>
                                    </el-col>
                                </el-row>
                                </el-col>
                                
                            </el-row>
                        </el-col>
                    </el-row>
                    <br/>
                    <el-row>
                        <el-col :span="24">
                            <el-row>
                                <el-col :span="2">项目名称：</el-col>
                                <el-col :span="21">
                                    <el-form-item label=" ">
                                         <el-input disabled="disabled" v-model="ruleForm.projectName"></el-input>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                        </el-col>
                    </el-row>
                    <br/>
                    <el-row>
                        <el-col :span="24">
                            <el-row>
                                <el-col :span="2">承担单位：</el-col>
                                <el-col :span="21">
                                    <el-form-item label=" ">
                                         <el-input disabled="disabled" v-model="ruleForm.projectUndertakeunit"></el-input>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                        </el-col>
                    </el-row>
                    <br/>
                    <el-row>
                        <el-col :span="24">
                            <el-row>
                                <el-col :span="12">
                                <el-row>
                                    <el-col :span="5">项目来源：</el-col>
                                    <el-col :span="18">
                                        <el-form-item label=" ">
                                            <el-input disabled="disabled" v-model="ruleForm.projectDepartresult"></el-input>
                                        </el-form-item>
                                    </el-col>
                                </el-row>
                                </el-col>
                                <el-col :span="12">
                                <el-row>
                                    <el-col :span="5">项目负责人：</el-col>
                                    <el-col :span="18">
                                        <el-form-item label=" ">
                                            <el-input disabled="disabled" v-model="ruleForm.projectPerson"></el-input>
                                        </el-form-item>
                                    </el-col>
                                </el-row>
                                </el-col>
                            </el-row>
                        </el-col>
                    </el-row>
                    <br/>
                    <el-row>
                        <el-col :span="24">
                            <el-row>
                                <el-col :span="12">
                                <el-row>
                                    <el-col :span="5">项目总经费(万元)：</el-col>
                                    <el-col :span="18">
                                        <el-form-item label=" ">
                                            <el-input disabled="disabled" v-model="ruleForm.projectMoney"></el-input>
                                        </el-form-item>
                                    </el-col>
                                </el-row>
                                </el-col>
                                <el-col :span="12">
                                <el-row>
                                    <el-col :span="5">财务到款时间：</el-col>
                                    <el-col :span="18">
                                        <el-form-item label=" ">
                                            <el-input disabled="disabled" v-model="ruleForm.billingTime"></el-input>
                                        </el-form-item>
                                    </el-col>
                                </el-row>
                                </el-col>
                            </el-row>
                        </el-col>
                    </el-row>
                    <br/>
                    <el-row>
                        <el-col :span="24">
                            <el-row>
                                <el-col :span="12">
                                <el-row>
                                    <el-col :span="5">已到账总经费(万元)：</el-col>
                                    <el-col :span="18">
                                        <el-form-item label=" ">
                                            <el-input disabled="disabled" clearable v-model="ruleForm.accounting">
                                            </el-input>
                                        </el-form-item> 
                                        
                                    </el-col>
                                </el-row>
                                </el-col>
                                <el-col :span="12">
                                <el-row>
                                    <el-col :span="5">未下拨经费(万元)：</el-col>
                                    <el-col :span="18">
                                        <el-form-item label=" ">
                                            <el-input disabled="disabled"  v-model="ruleForm.leaveMoney"></el-input>
                                        </el-form-item>
                                    </el-col>
                                </el-row>
                                </el-col>
                            </el-row>
                        </el-col>
                    </el-row>
                    <br/>
                    <el-row>
                        <el-col :span="24">
                            <el-row>
                                <el-col :span="12">
                                <el-row>
                                    <el-col :span="5">剩余可下拨经费(万元)：</el-col>
                                    <el-col :span="18">
                                        <el-form-item label=" ">
                                            <el-input disabled="disabled" v-model="ruleForm.leaveMoney" ></el-input>
                                        </el-form-item>
                                    </el-col>
                                </el-row>
                                </el-col>
                                <el-col :span="12">
                                <el-row>
                                    <el-col :span="5">剩余总经费(万元)：</el-col>
                                    <el-col :span="18">
                                        <el-form-item label=" ">
                                            <el-input disabled="disabled" v-model="ruleForm.leaveMoney" ></el-input>
                                        </el-form-item>
                                    </el-col>
                                </el-row>
                                </el-col>
                            </el-row>
                        </el-col>
                    </el-row>
                </div>
            </el-card>
            <el-card  style="margin-top: 20px;">
                <div v-if="showDiv"  class="text item">
                    <el-row>
                        <el-col :span="24">
                            <span style="color: blue; margin-left: 20px">下拨经费明细</span>
                            &nbsp;&nbsp;
                            <span style="color: rgb(168, 153, 153); margin-left: 20px">带<span style="color:red">*</span>符号为必添加</span>
                        </el-col>
                    </el-row>
                    <br/>
                    <hr/>
                    <br/>
                    <el-row>
                    <el-col :span="24">
                        <el-row>
                          <el-col :span="24">
                            <span>(单位：元)</span><span style="color:red">(请填写小数点后两位)</span>
                          </el-col>
                        </el-row>
                        <br/>
                        <el-row>
                            <el-col :span="12">
                                    <el-row>
                                        <el-col :span="5">到账直接经费：</el-col>
                                        <el-col :span="18">
                                            <el-form-item label=" " prop="directMoney">
                                                <el-input @change="sumMoney()" v-model="Info.directMoney"></el-input>
                                            </el-form-item>
                                        </el-col>
                                    </el-row>
                                    </el-col>
                                    <el-col :span="12">
                                    <el-row>
                                        <el-col :span="5">下拨直接经费：</el-col>
                                        <el-col :span="18">
                                            <el-form-item label=" ">
                                                <el-input @change="allMoney()" v-model="Info.UpdirectMoney"></el-input>
                                            </el-form-item>
                                        </el-col>
                                    </el-row>
                                </el-col>
                            </el-row>
                            <br/>
                            <el-row>
                            <el-col :span="12">
                                    <el-row>
                                        <el-col :span="5">到账间接经费：</el-col>
                                        <el-col :span="18">
                                            <el-form-item label=" " prop="indirectMoney">
                                                <el-input @change="sumMoney1()" v-model="Info.indirectMoney"></el-input>
                                            </el-form-item>
                                        </el-col>
                                    </el-row>
                                    </el-col>
                                    <el-col :span="12">
                                    <el-row>
                                        <el-col :span="5">下拨间接经费：</el-col>
                                        <el-col :span="18">
                                            <el-form-item label=" ">
                                                <el-input @change="allMoney1()" v-model="Info.UpindirectMoney"></el-input>
                                            </el-form-item>
                                        </el-col>
                                    </el-row>
                                </el-col>
                            </el-row>
                            <br/>
                            <el-row>
                            <el-col :span="12">
                                    <el-row>
                                        <el-col :span="5">到账总经费：</el-col>
                                        <el-col :span="18">
                                            <el-form-item label=" ">
                                                <el-input disabled v-model="DaoCountMoney"></el-input>
                                            </el-form-item>
                                        </el-col>
                                    </el-row>
                                    </el-col>
                                    <el-col :span="12">
                                    <el-row>
                                        <el-col :span="5">下拨总经费：</el-col>
                                        <el-col :span="18">
                                            <el-form-item label=" ">
                                                <el-input disabled v-model="Info.allocationExpenditure"></el-input>
                                            </el-form-item>
                                        </el-col>
                                    </el-row>
                                </el-col>
                            </el-row>
                        </el-col>
                    </el-row>
                </div>
            </el-card>
            <br/>
            <el-row style="margin-left: 1000px;">
                <el-col :span="24">
                    <el-form-item>
                        <el-button type="primary" @click="submitForm('ruleForm')">保存</el-button>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
        <br/>
    </div>
</template>

<script>
  export default {
    props:{id:undefined},
    data() {
      return {
        showDiv: false,
        Projectoptions:[],                  //项目编号查询
        ruleForm: {
          projectName: '',                  //项目名称
          projectUndertakeunit: '',         //承办单位
          projectDepartresult: "",          //项目来源
          projectPerson: "",                //项目负责人
          projectMoney: '',                 //项目总经费
          billingTime: '',                  //财务到款时间
          accounting:'',                    //已到账总经费
          leaveMoney:'',                    //未下拨总经费、剩余可下拨经费、剩余总金费
          specialMoney:'',                  //直接经费
        },
        Info:{
            projectId: '',                  //项目编号
            directMoney:'',                 //到账直接经费
            UpdirectMoney:'',               //下拨直接经费
            indirectMoney:'',               //到账间接经费
            UpindirectMoney:'',             //下拨间接经费
            allocationExpenditure:'',       //下拨总经费
            belowflowId:'',                 //外键流程表ID
            billingId:this.$route.query.id,                   //外键经费入帐单表ID
            isDelete:0,                     //是否删除
        },
        DaoCountMoney:'',                   //到账总经费
        rules: {
          projectId: [
            { required: true, message: '请输入项目编号', trigger: 'blur' },
          ],
          directMoney: [
            {  required: true, message: '请输入直接到账经费', trigger: 'change' }
          ],
          indirectMoney: [
            { required: true, message: '请输入间接到账经费', trigger: 'change' }
          ]
        }
      };
    },
    created() {
        this.ProjectSelect()
    },
    methods: {
    sumMoney() {
      if (
        this.Info.directMoney == undefined
      ) {
        return;
      }
      if (this.Info.directMoney <= 0) {
        this.$message("到账直接经费不能小于等于0");
        this.Info.directMoney = undefined;
        return;
      }
      if(this.ruleForm.specialMoney<this.Info.directMoney/10000){
            this.$message('经费不足！')
            return
        }
      if (this.Info.indirectMoney == undefined) {
        this.DaoCountMoney = this.Info.directMoney;
        return;
      }
      this.DaoCountMoney =
        Number(this.Info.indirectMoney) + Number(this.Info.directMoney);
    },
    sumMoney1() {
      if (
        this.Info.indirectMoney == undefined
      ) {
        return;
      }
      if (this.Info.indirectMoney <= 0) {
        this.$message("到账间接经费不能小于0");
        this.Info.indirectMoney = undefined;
        return;
      }
      if (this.Info.indirectMoney == undefined) {
        this.DaoCountMoney = this.Info.indirectMoney;
        return;
      }
      this.DaoCountMoney =
        Number(this.Info.indirectMoney) + Number(this.Info.directMoney);
       if(this.DaoCountMoney/10000>this.ruleForm.leaveMoney){
            this.$message('经费不足！！！')
            this.DaoCountMoney = undefined;
            this.Info.indirectMoney = undefined;
            return
       } 
    },
    allMoney(){
        if(this.Info.directMoney<this.Info.UpdirectMoney){
            this.$message('经费不足！！！')
            this.Info.UpdirectMoney=undefined;
            return
        }
        if (this.Info.UpdirectMoney <= 0) {
            this.$message("下拨直接经费不能小于0");
            this.Info.UpdirectMoney = undefined;
            return;
      }
        this.Info.allocationExpenditure =
        Number(this.Info.UpdirectMoney) + Number(this.Info.UpindirectMoney);
    },
    allMoney1(){
        if(this.Info.indirectMoney<this.Info.UpindirectMoney){
            this.$message('经费不足！！！')
            this.Info.UpindirectMoney=undefined;
            return
        }
        if (this.Info.UpindirectMoney <= 0) {
            this.$message("下拨直接经费不能小于0");
            this.Info.UpindirectMoney = undefined;
            return;
        }
            this.Info.allocationExpenditure =
            Number(this.Info.UpdirectMoney) + Number(this.Info.UpindirectMoney);
    },
        //添加方法
      submitForm(formName) {
        //判断到账总经费和添加的到账总经费大小
        this.$refs[formName].validate((valid) => {
          if (valid) {
            console.log(this.Info)
            this.http.post('api/tb_project_billing_allocation/basicBillingAdd',this.Info).then((res=>{
                if(res.status){
                    this.$message({
                        type: "success",
                        message: res.message
                    });
                    this.$router.push('/tb_project_billing_allocationList?id='+this.Info.billingId);
                }
                else{
                    this.$message({
                        type: "error",
                        message: res.message
                    });
                }
            }))
          } else {
            console.log('error submit!!');
            return false;
          }
        });
      },
      //项目编号查询方法
      ProjectSelect(){
        let url="api/tb_project_baseinfo_imitate/BaseinfoIdSearch";
        this.http.get(url,{},true).then((res=>{
            console.log(res)
            this.Projectoptions=res.data;
        }))
      },
      //经费分配添加上半部分数据反填方法
      detailProject(){
        this.showDiv = true;
        let id=this.Info.projectId
        if(id==''){
            this.$message('请选择要查询的基本信息项目编号！')
            return
        }
        else{
            let urls="api/tb_project_baseinfo_imitate/BaseinfoSearch?projectId="+id;
            this.http.get(urls,{},true).then((res=>{
                console.log(res)
                this.ruleForm=res.data[0];
            }))
        }
        
      }
    }
  }
</script>

<style>
.div_background{
    background-color: #ebebeb;
    width: 100%;
    height: 100%;
}
.box-card {
    margin-top: 10px;
}
.el-upload__tip {
  line-height: 1.2;
  
}
.ll {
  background-color: rgb(96, 89, 234);
  margin-left: 20px;
  width: 100px;
  height: 100px;
  line-height: 100px;
  margin-top: 5px;
}
.el-input__wrapper {
  display: inline-flex;
  flex-grow: 1;
  align-items: center;
  justify-content: center;
  padding: 1px 11px;
  background-color: var(--el-input-bg-color, var(--el-fill-color-blank));
  background-image: none;
  border-radius: var(--el-input-border-radius, var(--el-border-radius-base));
  transition: var(--el-transition-box-shadow);
  box-shadow: 0 0 0 0px var(--el-input-border-color, var(--el-border-color))
    inset;
  border-bottom: 1px solid;
}
.el-form-item.is-error .el-input__wrapper {
  box-shadow: 0 0 0 1px #ffffff inset;
}
.el-input__wrapper.is-focus {
  box-shadow: 0 0 0 1px white inset;
}
.el-input {
  --el-input-text-color: var(--el-text-color-regular);
  --el-input-border: var(--el-border);
  --el-input-hover-border: var(--el-border-color-hover);
  --el-input-focus-border: var(--el-color-primary);
  --el-input-transparent-border: 0 0 0 1px transparent inset;
  --el-input-border-color: var(--el-border-color);
  --el-input-border-radius: var(--el-border-radius-base);
  --el-input-bg-color: var(--el-fill-color-blank);
  --el-input-icon-color: var(--el-text-color-placeholder);
  --el-input-placeholder-color: var(--el-text-color-placeholder);
  --el-input-hover-border-color: #ffffff;
  --el-input-clear-hover-color: var(--el-text-color-secondary);
  --el-input-focus-border-color: var(--el-color-primary);
}
.el-select {
  --el-select-border-color-hover: #ffffff;
  --el-select-disabled-border: var(--el-disabled-border-color);
  --el-select-font-size: var(--el-font-size-base);
  --el-select-close-hover-color: var(--el-text-color-secondary);
  --el-select-input-color: var(--el-text-color-placeholder);
  --el-select-multiple-input-color: var(--el-text-color-regular);
  --el-select-input-focus-border-color: #ffffff;
  --el-select-input-font-size: 14px;
}
</style>